<template>
  <div class="tabs">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="区域应急管理" name="first" class="el-tab-pane">
        <el-container>
          <el-aside width="200px">
            <navBar></navBar>
          </el-aside>
          <el-main style="height: 100%;padding: 0">
            <teamTable></teamTable>
        </el-main>
        </el-container>
      </el-tab-pane>
      <el-tab-pane label="应急指挥调度" name="second" class="el-tab-pane">
        <!--<nevBar style="width: 200px;float: left"></nevBar>-->
        <!--<div style="float: left;width: calc(100% - 200px)">-->
          <!--<mapPage></mapPage>-->
        <!--</div>-->
        <el-container>
          <el-aside width="200px">
            <navBar></navBar>
          </el-aside>
          <el-main style="height: 100%">
            <mapPage></mapPage>
          </el-main>
        </el-container>
      </el-tab-pane>
      <el-tab-pane label="系统配置管理" name="third" class="el-tab-pane">
        <el-container>
          <el-aside width="200px">
            <navBar></navBar>
          </el-aside>
          <el-main style="height: 100%">
            <mapPage></mapPage>
          </el-main>
        </el-container>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
  import navBar from '@/components/page/navBar'
  import teamTable from '@/components/page/rescueTeamPage'
  import mapPage from '@/components/page/mapPage'
  export default {
    name: "tabs",
    components: {
      navBar,
      teamTable,
      mapPage
    },
    data() {
      return {
        activeName: 'first',
      };
    },
    mounted() {

    },
    methods: {
      handleClick(tab, event) {
        console.log(tab, event);
        if(event.explicitOriginalTarget.data==='应急指挥调度'){
          console.log(8);

        }else if(event.explicitOriginalTarget.data==='系统配置管理'){

        }else {

        }
      },
      menuSelected(){

      },
      leftMenus(){

      }
    }
  }
</script>

<style>
  .el-tab-pane:after {
    content: '';
    clear: both;
  }
  .tabs{
    padding: 0 20px;
  }
</style>
